<template>
    <div class="width-full">
        <div v-if="headerProp && Object.keys(headerProp).length > 0">
            <store-msg
                    ref="refHeader"
                    v-if="headerProp.headerType == 'moudule1'"
                    :headerProp="headerProp"
                    :discountList="discountList"
                    @countDistance="countDistance"
                    @clickHeaderImg="clickHeaderImg"
                    @doAttention="doAttention"
                    @showShare="$emit('showShare')"
            ></store-msg>
            <!--v-else-if="headerProp.headerType == 'moudle2'"-->
            <user-msg
                    ref="refHeader"
                    v-else-if="headerProp.headerType == 'moudule2'"
                    :headerProp="headerProp"
                    @clickTitle="clickTitle"
                    @clickHeaderImg="clickHeaderImg"
                    @doAttention="doAttention"
            >
            </user-msg>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Header",
        props:{
            headerProp:Object,
            discountList:Array,
        },
        mounted(){
        },
        methods:{
            changeIndex(index) {
                this.$refs.refHeader.headerMsg.nowSwiperIndex = index;
            },
            clickHeaderImg(val){
                this.$emit('clickHeaderImg',val)
            },
            clickTitle(val){
                this.$emit('clickTitle',val)
            },
            doAttention(concernType,concernKey,key,cb,isCancelAttention){
                this.$emit('doAttention',concernType,concernKey,key,cb,isCancelAttention)
            },
            countDistance(obj){
                this.$emit('countDistance',obj);
            }
        },
        components:{
            'store-msg':()=>import('./Amusing'),
            'user-msg':()=>import('./Look'),
        }
    }
</script>

<style scoped>

</style>